<!DOCTYPE html>
<html lang="en">

<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        #bgImgs {
            width: 100vw;
            height: 100vh;
            overflow: hidden;
            position: relative;
        }

        .itemImg {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;

        }
    </style>
</head>

<body>
    <div id="bgImgs">
        <img class="itemImg" src="./imgs/1.jpg" alt="图片">
    </div>
</body>
<script>
    (function moveImg() {
        let img = document.querySelector('img');
        let height = (window.getComputedStyle(img).height).slice(0, -2) * 1;
        let findIndex = 0;;
        let id = setInterval(() => {
            if (findIndex < -348) findIndex = 0;
            img.style.top = --findIndex + 'px';
            console.log(window.getComputedStyle(img).top);
        }, 10);

    })()

</script>

</html>